<template>
  <li>
    <span> 请选择{{ title }}类型： </span>
    <div>
      <el-select v-model="value" @change="sendId" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item[selId]"
          :label="item[type]"
          :value="item[selId]"
        >
        </el-option>
      </el-select>
    </div>
  </li>
</template>

<script>
import { getExamType, getSubject, getQuestionsType } from "@/api/exam";
export default {
  props: {
    title: {
      type: String,
    },
    type: {
      type: String,
    },
    selId: {
      type: String,
    },
  },
  data() {
    return {
      options: [],
      value: "",
    };
  },
  created() {
    switch (this.type) {
      case "exam_name":
        getExamType().then((res) => {
          this.options = res.data;
        });
        break;
      case "subject_text":
        getSubject().then((res) => {
          this.options = res.data;
        });
        break;
      case "questions_type_text":
        getQuestionsType().then((res) => {
          this.options = res.data;
        });
        break;
    }
  },
  methods: {
    sendId() {
      this.$emit("sendId", {
        value: this.value,
        type: this.selId,
      });
    },
  },
};
</script>

<style scoped>
li span {
  display: inline-block;
  padding: 10px 0;
}
</style>